import { defineComponent, ref, watch } from 'vue';
/* scss */
import './tabs.scss';

export default defineComponent({
  name: 'BiTab',
  props: {
    tabList: {
      type: Array,
      required: true,
    },
    currentTab: {
      type: String,
      required: true,
    },
    onInput: {
      type: Function
    }
  },
  methods: {
    onTabInputHandler(tab: string) {
      this.$emit('input', tab)
    }
  },
  render() {
    return (
      <el-tabs value={this.currentTab} onInput={this.onTabInputHandler}>
        {this.tabList.map((item: any, index: number) => (
          <el-tab-pane 
            class="setting-gpt-bi_el-tab"
            key={index} 
            label={item.label} 
            name={item.name} 
          >
            {this.$slots[item.name]}
          </el-tab-pane>
        ))}
      </el-tabs>
    );
  },
});
